<template>

    <div class="father">
        {{money}}
        {{car}}
        <Child>
        </Child>
    </div>
</template>
<script setup   lang="ts">
import {ref,provide, reactive} from 'vue'
import Child from '@/pages/provide_inject/Child.vue';
let money = ref(100);
let car = reactive({
    name:'奔驰',
    loans:1000000
})

//向后代提供数据。提供propertyContext上下文数据。money:(对象的简写形式)传递ref响应式对象
provide('propertyContext', {money,changeMoney});
provide('immovable', car);

//祖件向孙组件提供方法，供孙组件传值给祖件
function changeMoney(value:number){
    money.value -= value;
}
</script>
<style scoped>
.father{
    padding: 50px;
    width: 50vw;
    height: 60vh;
    background-color: rgb(192, 47, 173);
}
</style>
